<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>labeling-utils - Documentation</title>

    <script src="scripts/prettify/prettify.js"></script>
    <script src="scripts/prettify/lang-css.js"></script>
    <!--[if lt IE 9]>
      <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <link type="text/css" rel="stylesheet" href="styles/prettify.css">
    <link type="text/css" rel="stylesheet" href="styles/jsdoc.css">
</head>
<body>

<input type="checkbox" id="nav-trigger" class="nav-trigger" />
<label for="nav-trigger" class="navicon-button x">
  <div class="navicon"></div>
</label>

<label for="nav-trigger" class="overlay"></label>

<nav>
    <h2><a href="index.html">Home</a></h2><h3>Classes</h3><ul><li><a href="LabelElement.html">LabelElement</a></li><li><a href="module-labeling-utils-GridPolygon.html">GridPolygon</a></li><li><a href="module-mgrs-utils-NonPolarGridZone.html">NonPolarGridZone</a><ul class='methods'><li data-type='method'><a href="module-mgrs-utils-NonPolarGridZone.html#toPolygon">toPolygon</a></li><li data-type='method'><a href="module-mgrs-utils-NonPolarGridZone.html#toPolyline">toPolyline</a></li></ul></li><li><a href="module-mgrs-utils-VisibleGridZone.html">VisibleGridZone</a><ul class='methods'><li data-type='method'><a href="module-mgrs-utils-VisibleGridZone.html#getCenterLabel">getCenterLabel</a></li><li data-type='method'><a href="module-mgrs-utils-VisibleGridZone.html#getLabels">getLabels</a></li></ul></li></ul><h3>Modules</h3><ul><li><a href="module-constants.html">constants</a></li><li><a href="module-geometry-utils.html">geometry-utils</a><ul class='methods'><li data-type='method'><a href="module-geometry-utils.html#~extentToPolygon">extentToPolygon</a></li><li data-type='method'><a href="module-geometry-utils.html#~pointToGeographic">pointToGeographic</a></li><li data-type='method'><a href="module-geometry-utils.html#~polygonToPolyline">polygonToPolyline</a></li><li data-type='method'><a href="module-geometry-utils.html#~toGeographic">toGeographic</a></li><li data-type='method'><a href="module-geometry-utils.html#~toWebMercator">toWebMercator</a></li></ul></li><li><a href="module-labeling-utils.html">labeling-utils</a><ul class='methods'><li data-type='method'><a href="module-labeling-utils.html#~distanceFromMapEdge">distanceFromMapEdge</a></li><li data-type='method'><a href="module-labeling-utils.html#~getScreenSize">getScreenSize</a></li><li data-type='method'><a href="module-labeling-utils.html#~getWidthOfText">getWidthOfText</a></li><li data-type='method'><a href="module-labeling-utils.html#~padZero">padZero</a></li><li data-type='method'><a href="module-labeling-utils.html#~screenDistanceBetweenPoints">screenDistanceBetweenPoints</a></li></ul></li><li><a href="module-mgrs-utils.html">mgrs-utils</a><ul class='methods'><li data-type='method'><a href="module-mgrs-utils.html#~getInterval">getInterval</a></li><li data-type='method'><a href="module-mgrs-utils.html#~handle100kGrids">handle100kGrids</a></li><li data-type='method'><a href="module-mgrs-utils.html#~handleIntervals">handleIntervals</a></li><li data-type='method'><a href="module-mgrs-utils.html#~handleZonePolygon">handleZonePolygon</a></li><li data-type='method'><a href="module-mgrs-utils.html#~processZonePolygons">processZonePolygons</a></li><li data-type='method'><a href="module-mgrs-utils.html#~zonesFromExtent">zonesFromExtent</a></li></ul></li></ul><h3>Externals</h3><ul><li><a href="external-Color.html">Color</a></li><li><a href="external-Extent.html">Extent</a></li><li><a href="external-Font.html">Font</a></li><li><a href="external-Geometry.html">Geometry</a></li><li><a href="external-Graphic.html">Graphic</a></li><li><a href="external-GraphicsLayer.html">GraphicsLayer</a></li><li><a href="external-Map.html">Map</a></li><li><a href="external-Point.html">Point</a></li><li><a href="external-Polygon.html">Polygon</a></li><li><a href="external-Polyline.html">Polyline</a></li><li><a href="external-SpatialReference.html">SpatialReference</a></li><li><a href="external-TextSymbol.html">TextSymbol</a></li></ul>
</nav>

<div id="main">
    
    <h1 class="page-title">labeling-utils</h1>
    

    




<section>

<header>
    
        
            
        
    
</header>

<article>
    <div class="container-overview">
    
        
            <div class="description"><p>Module containing labeling utilities used by GridOverlay widgets.</p></div>
        

        
            




<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="lib_labeling-utils.js.html">lib/labeling-utils.js</a>, <a href="lib_labeling-utils.js.html#line6">line 6</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





























        
    
    </div>

    

    

    
        <h3 class="subsection-title">Classes</h3>

        <dl>
            <dt><a href="module-labeling-utils-GridPolygon.html">GridPolygon</a></dt>
            <dd></dd>
        </dl>
    

     

    

    

    
        <h3 class="subsection-title">Methods</h3>

        
            

    

    <h4 class="name" id="~distanceFromMapEdge"><span class="type-signature">(inner) </span>distanceFromMapEdge<span class="signature">(mapPoint, map, mgrs<span class="signature-attributes">opt</span>)</span><span class="type-signature"> &rarr; {<a href="module-labeling-utils.html#~ScreenDistance">module:labeling-utils~ScreenDistance</a>}</span></h4>

    




<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="lib_labeling-utils.js.html">lib/labeling-utils.js</a>, <a href="lib_labeling-utils.js.html#line118">line 118</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>Computes the pixel distance of a point from the map edge (based on the current map screen display)</p>
</div>











    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        
        <th>Attributes</th>
        

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>mapPoint</code></td>
            

            <td class="type">
            
                
<span class="param-type"><a href="external-Geometry.html">external:Geometry</a></span>


            
            </td>

            
                <td class="attributes">
                

                

                
                </td>
            

            
                <td class="default">
                
                </td>
            

            <td class="description last"><p>An esri map point geometry object</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>map</code></td>
            

            <td class="type">
            
                
<span class="param-type"><a href="external-Map.html">external:Map</a></span>


            
            </td>

            
                <td class="attributes">
                

                

                
                </td>
            

            
                <td class="default">
                
                </td>
            

            <td class="description last"><p>An esri map object</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>mgrs</code></td>
            

            <td class="type">
            
                
<span class="param-type">boolean</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                

                
                </td>
            

            
                <td class="default">
                
                    <code>true</code>
                
                </td>
            

            <td class="description last"><p>A boolean indicating if the check is for MGRS coords</p></td>
        </tr>

    
    </tbody>
</table>














<h5>Returns:</h5>

        
<div class="param-desc">
    <p>An object with the height and width properties</p>
</div>



<dl class="param-type">
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type"><a href="module-labeling-utils.html#~ScreenDistance">module:labeling-utils~ScreenDistance</a></span>


    </dd>
</dl>

    


        
            

    

    <h4 class="name" id="~getScreenSize"><span class="type-signature">(inner) </span>getScreenSize<span class="signature">(geometry, map)</span><span class="type-signature"> &rarr; {<a href="module-labeling-utils.html#~ScreenSize">module:labeling-utils~ScreenSize</a>}</span></h4>

    




<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="lib_labeling-utils.js.html">lib/labeling-utils.js</a>, <a href="lib_labeling-utils.js.html#line77">line 77</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>Computes the height and width of a geometry (in pixels) based on the current map display (on screen)</p>
</div>











    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>geometry</code></td>
            

            <td class="type">
            
                
<span class="param-type"><a href="external-Geometry.html">external:Geometry</a></span>


            
            </td>

            

            

            <td class="description last"><p>Any non-point esri geometry object</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>map</code></td>
            

            <td class="type">
            
                
<span class="param-type"><a href="external-Map.html">external:Map</a></span>


            
            </td>

            

            

            <td class="description last"><p>An esri map object</p></td>
        </tr>

    
    </tbody>
</table>














<h5>Returns:</h5>

        
<div class="param-desc">
    <p>An object with the height and width properties</p>
</div>



<dl class="param-type">
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type"><a href="module-labeling-utils.html#~ScreenSize">module:labeling-utils~ScreenSize</a></span>


    </dd>
</dl>

    


        
            

    

    <h4 class="name" id="~getWidthOfText"><span class="type-signature">(inner) </span>getWidthOfText<span class="signature">(text, fontFamily, fontSize)</span><span class="type-signature"> &rarr; {Number}</span></h4>

    




<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="lib_labeling-utils.js.html">lib/labeling-utils.js</a>, <a href="lib_labeling-utils.js.html#line36">line 36</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>Determines the width of a text element in pixels</p>
</div>









    <h5>Example</h5>
    
    <pre class="prettyprint"><code>// returns 22getWidthOfText("12S", "Arial, Helvetica, sans-serif", 12)</code></pre>




    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>text</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            

            <td class="description last"><p>The text string to measure</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>fontFamily</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            

            <td class="description last"><p>The font family (e.g. &quot;Arial, Helvetica, sans-serif&quot;)</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>fontSize</code></td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            

            <td class="description last"><p>The font size in pixels</p></td>
        </tr>

    
    </tbody>
</table>














<h5>Returns:</h5>

        
<div class="param-desc">
    <p>The font width in pixels</p>
</div>



<dl class="param-type">
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">Number</span>


    </dd>
</dl>

    


        
            

    

    <h4 class="name" id="~padZero"><span class="type-signature">(inner) </span>padZero<span class="signature">(number, width)</span><span class="type-signature"> &rarr; {String}</span></h4>

    




<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="lib_labeling-utils.js.html">lib/labeling-utils.js</a>, <a href="lib_labeling-utils.js.html#line56">line 56</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>Converts a number to a string and adds leading zeros to match the specified width</p>
</div>









    <h5>Example</h5>
    
    <pre class="prettyprint"><code>// returns "001"padZero(1, 3)// returns "30" (no zero is added because width is already 2)padZero(30, 2)</code></pre>




    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>number</code></td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            

            <td class="description last"><p>The number to be converted to string with leading zeros</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>width</code></td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            

            <td class="description last"><p>The desired width of the returned string</p></td>
        </tr>

    
    </tbody>
</table>














<h5>Returns:</h5>

        
<div class="param-desc">
    <p>The resulting number, converted to a string, with leading zeros</p>
</div>



<dl class="param-type">
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">String</span>


    </dd>
</dl>

    


        
            

    

    <h4 class="name" id="~screenDistanceBetweenPoints"><span class="type-signature">(inner) </span>screenDistanceBetweenPoints<span class="signature">(mapPoint1, mapPoint2, map)</span><span class="type-signature"> &rarr; {<a href="module-labeling-utils.html#~ScreenDistance">module:labeling-utils~ScreenDistance</a>}</span></h4>

    




<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="lib_labeling-utils.js.html">lib/labeling-utils.js</a>, <a href="lib_labeling-utils.js.html#line160">line 160</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>Computes the pixel distance between points (based on the current map screen display)</p>
</div>











    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>mapPoint1</code></td>
            

            <td class="type">
            
                
<span class="param-type"><a href="external-Geometry.html">external:Geometry</a></span>


            
            </td>

            

            

            <td class="description last"><p>An esri map point geometry object</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>mapPoint2</code></td>
            

            <td class="type">
            
                
<span class="param-type"><a href="external-Geometry.html">external:Geometry</a></span>


            
            </td>

            

            

            <td class="description last"><p>An esri map point geometry object</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>map</code></td>
            

            <td class="type">
            
                
<span class="param-type"><a href="external-Map.html">external:Map</a></span>


            
            </td>

            

            

            <td class="description last"><p>An esri map object</p></td>
        </tr>

    
    </tbody>
</table>














<h5>Returns:</h5>

        
<div class="param-desc">
    <p>An object with the height and width properties</p>
</div>



<dl class="param-type">
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type"><a href="module-labeling-utils.html#~ScreenDistance">module:labeling-utils~ScreenDistance</a></span>


    </dd>
</dl>

    


        
    

    
        <h3 class="subsection-title">Type Definitions</h3>

        
                
<h4 class="name" id="~LabelParameters">LabelParameters</h4>





<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="lib_LabelElement.js.html">lib/LabelElement.js</a>, <a href="lib_LabelElement.js.html#line40">line 40</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>



    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>xOffset</code></td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            

            <td class="description last"><p>The <em>x</em> offset</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>yOffset</code></td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            

            <td class="description last"><p>The <em>y</em> offset</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>rotation</code></td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            

            <td class="description last"><p>The text rotation in degrees clockwise (must be an increment of 90°). 0 = Horizontal</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>The</code></td>
            

            <td class="type">
            
                
<span class="param-type"><a href="external-Color.html">external:Color</a></span>


            
            </td>

            

            

            <td class="description last"><p>color of the label text</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>fontFamily</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            

            <td class="description last"><p>The font-family of the text</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>fontSize</code></td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>
|

<span class="param-type">String</span>


            
            </td>

            

            

            <td class="description last"><p>The css font size (if Number, then &quot;px&quot; units are assumed)</p></td>
        </tr>

    
    </tbody>
</table>






<div class="description">
    <p>An object that contains arguments used during labeling, allowing objects to be passed by reference</p>
</div>








            
                
<h4 class="name" id="~ScreenDistance">ScreenDistance</h4>





<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="lib_labeling-utils.js.html">lib/labeling-utils.js</a>, <a href="lib_labeling-utils.js.html#line103">line 103</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>



    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>horizontal</code></td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            

            <td class="description last"><p>The horizontal distance in pixels</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>vertical</code></td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            

            <td class="description last"><p>The vertical distance in pixels</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>total</code></td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            

            <td class="description last"><p>The total distance in pixels</p></td>
        </tr>

    
    </tbody>
</table>






<div class="description">
    <p>An object that contains horizontal and vertical properties, used for determining screen distance of points</p>
</div>








            
                
<h4 class="name" id="~ScreenSize">ScreenSize</h4>





<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="lib_labeling-utils.js.html">lib/labeling-utils.js</a>, <a href="lib_labeling-utils.js.html#line64">line 64</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>



    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>width</code></td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            

            <td class="description last"><p>The width in pixels</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>height</code></td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            

            <td class="description last"><p>The height in pixels</p></td>
        </tr>

    
    </tbody>
</table>






<div class="description">
    <p>An object that contains height and width properties, used for determining screen size of graphics</p>
</div>








            
    

    
</article>

</section>




</div>

<br class="clear">

<footer>
    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.4.0</a> using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
</footer>

<script>prettyPrint();</script>
<script src="scripts/linenumber.js"></script>
</body>
</html>